<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style>
			html,
			body {
				height: 100%;
				margin: 0px;
				padding: 0px;
				background-color: #F8F8F8;
			}
			.mui-bar{
			background:##F8F8F8;
			}
			
		.mui-titles{
			position: relative;
			float: right;
		}
		.mui-content{
			position: relative;
			float: left;
			width: 100%;
			padding: 10px  15px;
			box-sizing: border-box;
			display: inline-block;
			background:#F8F8F8;
		}		
		
		.biaoti{
			position: relative;
			float: left;
			width: calc(100% - 44px);
			height: 100%;
			display: flex;
			justify-content: space-around;
			padding-top: 5px;
			box-sizing: border-box;
		}
		
		.biaoti>div{
			width: 64px;
			height: 35px;
			font-size:15px;
            font-weight:bold;
            color:rgba(51,51,51,1);
			line-height: 35px;
			box-sizing: border-box;
		}
	.tiactive{
			border-bottom: 2px  solid #FE615E;
			color: #FE615E!important;
	}
		
		.mui-bar-nav>img:nth-child(1){
			position: relative;
			float: left;
			width: 20px;
			height: 27px;
			margin-top: 10px;
		}
	
		a{
		color:rgba(51,51,51,1);
		}
		a:active{
				color:rgba(51,51,51,1);
		}
		.dan,.dans{
			position: relative;
			float: left;
			width: 100%;
			background: #FFFFFF;
			margin-top: 15px;
			padding: 0px 10px ;
			box-sizing: border-box;
		}
		
		.dantitle{
			position: relative;
			float: left;
            width: 100%;
			height: 43px;
			border-bottom: 1px  solid  rgba(248,248,248,1);
		}
		.dantitle>div:nth-child(1){
			position: relative;
			float: left;
			width: calc(100% - 90px);
			height:100%;
			font-size:14px;
            font-weight:500;
            color:rgba(51,51,51,1);
            line-height:43px;
		}
		
		.dantitle>div:nth-child(2){
			position: relative;
			float: right;
			width: 80px;
			height:100%;
			font-size:14px;
		    font-weight:500;
			text-align: right;
		    color:rgba(254,31,31,1);
		    line-height:43px;
		}
		.dancontent{
			position: relative;
			float: left;
			width: 100%;
			height: 130px;
			border-bottom: 1px  solid  rgba(248,248,248,1);
		}
		.dancontent>div:nth-child(1){
			position: relative;
			float: left;
			width: 114px;
			height: 100%;
			padding-top: 15px;
			box-sizing: border-box;
		}
		.dancontent>div:nth-child(1)>img{
			width: 114px;
			height: 98px;
		}
		
		.dancontent>div:nth-child(2){
			position: relative;
			float: right;
			width: calc(100% -  124px);
			height: 100%;
			padding:15px 0px;
			box-sizing: border-box;
		}
		
		.dancontent>div:nth-child(2)>div:nth-child(1){
			position: relative;
			float: right;
			width: 100%;
			height: 42px;
			font-size:14px;
            font-weight:500;
            color:rgba(51,51,51,1);
            line-height:21px;
		}
		
		.dancontent>div:nth-child(2)>div:nth-child(2){
			position: absolute;
			bottom: 15px;
			width: 100%;
			height: 18px;
		}
		.dancontent>div:nth-child(2)>div:nth-child(2)>div:nth-child(1){
			position: relative;
			float: left;
			width: 50%;
			height: 100%;
			font-size:16px;
            font-weight:bold;
            color:rgba(51,51,51,1);
            line-height:18px;
		}
		
			.dancontent>div:nth-child(2)>div:nth-child(2)>div:nth-child(2){
			position: relative;
			float: left;
			width: 50%;
			height: 100%;
			font-size:16px;
			text-align: right;
			color:rgba(51,51,51,1);
			line-height:18px;
		}
		
		.danqueren{
			position: relative;
			width: 100%;
			height: 58px;
            float: left; 			
		}
		.danqueren>div:nth-child(1){
			width: 65px;
			height: 28px;
			text-align: center;
			position: relative;
			float: left;
			margin-top: 15px;
			line-height: 28px;
			font-size:13px;
            font-weight:500;
            color:rgba(255,255,255,1); 
			background:rgba(254,97,94,1);
            border-radius:3px;
		}
			.danqueren>div:nth-child(2){
			width: 65px;
			height: 28px;
			text-align: center;
			position: relative;
			float: left;
			margin-top: 15px;
			line-height: 28px;
			font-size:13px;
		    font-weight:500;
		   color:rgba(153,153,153,1);
		    border-radius:3px;
			border:1px solid rgba(223,223,223,1);
             border-radius:3px;
			 margin-left: 8px;
		}
		
		.danqueren>div:nth-child(3){
					width: 65px;
								height: 28px;
								text-align: center;
								position: relative;
								float: right;
								margin-top: 15px;
								line-height: 28px;
								font-size:13px;
					 font-weight:500;
					color:rgba(153,153,153,1);
					 border-radius:3px;
						border:1px solid rgba(223,223,223,1);
					  border-radius:3px;
				    margin-left: 8px;
				}
		.danqueren>div:nth-child(3)>span:nth-child(1){
			position: relative;
			float: right;
			padding: 0  5px;
			box-sizing: border-box;
			font-size:16px;
            font-weight:bold;
            color:rgba(254,31,31,1);
            line-height:28px;
		}
				.danqueren>div:nth-child(3)>span:nth-child(2){
					position: relative;
					float: right;
					padding: 0  5px;
					box-sizing: border-box;
					font-size:16px;
				color:rgba(51,51,51,1);
					line-height:28px;
				}
				
				
				
				
				
			/*  视频 */
				
				
				.danstitle{
					position: relative;
					float: left;
				    width: 100%;
					height: 43px;
					border-bottom: 1px  solid  rgba(248,248,248,1);
				}
				.danstitle>div:nth-child(1){
					position: relative;
					float: left;
					width: calc(100% - 90px);
					height:100%;
				}
				.danstitle>div:nth-child(1)>img{
					position: relative;
					float: left;
					width: 35px;
						border-radius: 50%;
					height: 35px;
					margin-top: 5px;
				}
					.danstitle>div:nth-child(1)>div{
					position: relative;
					float: left;
					width: 35px;
					height: 35px;
					margin-left: 10px;
					font-size:14px;
					font-weight:500;
					color:rgba(51,51,51,1);
					line-height:43px;
					 line-height:43px;
				}
				
				.danstitle>div:nth-child(2){
					position: relative;
					float: right;
					width: 80px;
					height:100%;
					font-size:14px;
				    font-weight:500;
					text-align: right;
				    color:rgba(254,31,31,1);
				    line-height:43px;
				}
				.danscontent{
					position: relative;
					float: left;
					width: 100%;
					height: 130px;
					border-bottom: 1px  solid  rgba(248,248,248,1);
				}
				.danscontent>div:nth-child(1){
					position: relative;
					float: left;
					width: 114px;
					height: 100%;
					padding-top: 15px;
					box-sizing: border-box;
				}
				.danscontent>div:nth-child(1)>img{
					width: 114px;
					height: 98px;
				
				}
				
				.danscontent>div:nth-child(2){
					position: relative;
					float: right;
					width: calc(100% -  124px);
					height: 100%;
					padding:15px 0px;
					box-sizing: border-box;
				}
				
				.danscontent>div:nth-child(2)>div:nth-child(1){
					position: relative;
					float: right;
					width: 100%;
					font-size:14px;
					height: 42px;
				    font-weight:500;
				    color:rgba(51,51,51,1);
				    line-height:21px;
				}
			
				.danscontent>div:nth-child(2)>div:nth-child(2){
					position: absolute;
					bottom: 15px;
					width: 100%;
					height: 18px;
				}
				.danscontent>div:nth-child(2)>div:nth-child(2)>div:nth-child(1){
					position: relative;
					float: left;
					width: 50%;
					height: 100%;
					font-size:16px;
				    font-weight:bold;
				    color:rgba(51,51,51,1);
				    line-height:18px;
				}
				
					.danscontent>div:nth-child(2)>div:nth-child(2)>div:nth-child(2){
					position: relative;
					float: left;
					width: 50%;
					height: 100%;
					font-size:14px;
					text-align: right;
					color:rgba(51,51,51,1);
					line-height:18px;
				}
				
				.dansqueren{
					position: relative;
					width: 100%;
					height: 58px;
				    float: left; 			
				}
				.dansqueren>div:nth-child(1){
							position: relative;
							float: right;
							width: 100% ;
							height: 28px;
							margin-top: 15px;
						}
				.dansqueren>div:nth-child(1)>span:nth-child(1){
					position: relative;
					float: right;
					padding: 0  5px;
					box-sizing: border-box;
					font-size:16px;
				    font-weight:bold;
				    color:rgba(254,31,31,1);
				    line-height:28px;
				}
						.dansqueren>div:nth-child(1)>span:nth-child(2){
							position: relative;
							float: right;
							padding: 0  5px;
							box-sizing: border-box;
							font-size:16px;
						color:rgba(51,51,51,1);
							line-height:28px;
						}
						
				 #login{
					 
					 height: 50px!important;
					 line-height: 50px!important;
					 padding: 0 !important;
					 margin-top: 50px;
				 }
				
							
							.cancel{
								position: absolute;
								right: 20px;
								color: black;
								font-size: 16px;
								top: 12px;
							}
							.tanchuang{
								position: absolute;
								z-index: 100;
								width: 100%;
								height: 100%;
								background: rgba(1,1,1,0.6);
							}
							
							#login-form{
                                margin-top: 40px;								
							}
		</style>
	</head>

	<body contextmenu="return false;">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<div class="biaoti">
				<div class="tiactive" index="0">我的视频</div>
				<div index="1">我的商品</div>
			</div>
		</header>
		<div class="mui-content" id="content">
			<div class="danone">
				<!-- <div class="dans">
					<div class="danscontent">
						<div><img src="../image/orders.png" /></div>
						<div>
							<div>这是视频名称</div>
							<div>
								<div>20</div>
								<div>单价</div>
							</div>
						</div>

					</div>
					<div class="danqueren">
						<div class='xq'>查看详情</div>
						<div class='up' >修改资料</div>
						<div class='deleteshang' >删除</div>
					</div>
				</div> -->
			</div>


			<div class="dantwo" style="display: none;">
					<!-- <div class="dans">
					<div class="danscontent">
						<div><img src="../image/orders.png" /></div>
						<div>
							<div>这是商品名称这是商品名称</div>
							<div>
								<div>50</div>
								<div>单价</div>
							</div>
						</div>
				
					</div>
					<div class="danqueren">
						<div class='xq'>查看详情</div>
						<div class='up' >修改资料</div>
						<div class='deleteshang' >删除</div>
					</div>
				</div> -->
			</div>

		</div>


	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/jquery-3.1.1.min.js"></script>
	<script src="myshangpin.js"></script>
	<script type="text/javascript" charset="utf-8">
		window.addEventListener("refresh", function (e) {
			location.reload();
			});
			var url = '';
		mui.plusReady(function() {
			url = plus.storage.getItem('url');
			var user = plus.storage.getItem('user');
			user = JSON.parse(user);
			var shipage = 1;
			var shangpage = 1;
			var type = 0;
			
			
			
			
			mui.init({
				pullRefresh : {
					container:'#content',//待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等
					up : {
						height:50,//可选.默认50.触发上拉加载拖动距离
						auto:true,//可选,默认false.自动上拉加载一次
						contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
						contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
						callback :function(){
						getData(function(){
							mui('#content').pullRefresh().endPullupToRefresh();
						})
						} //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
						},
				}
			});
			//获取数据
			function getData(func){
				var page =1;
				if(type==0){
					page = 1;
				}else if(type==1){
					page = shipage;
				}else if(type==2){
					page = shangpage;
				}
				if(page==0){
					mui.toast('没有更多了');
					if(func){
						func();
					}
					return
				}
				plus.nativeUI.showWaiting();
				mui.post(url+'/juyou/shangping/getmychu',{token:user.token,page:page,type:type},function(res){
					plus.nativeUI.closeWaiting();
					if(res.code==200){
						if(type==0){
							if(res.data.shiping.length<10){
								shipage = 0;
							}
							mui.each(res.data.shiping,function(i,v){
								type1(v);
							})
							if(res.data.shangping.length<10){
								shangpage = 0;
							}
							mui.each(res.data.shangping,function(i,v){
								type2(v);
							})
							type = 1;
						}else if(type==1){
							if(res.data.length<10){
								shipage = 0;
							}
							mui.each(res.data,function(i,v){
								type1(v)
							})
						}else if(type==2){
							if(res.data.length<10){
								shangpage = 0;
							}
							mui.each(res.data,function(i,v){
								type2(v)
							})
						}
					}else{
						mui.toast(res.msg);
					}
					if(func){
						func();
					}
				})
				
			}
			
			var height = $(window).height();
			$("body").css("height", height);
			//订单切换
			mui(".biaoti").on("tap", "div", function() {
				var state = $(this).addClass("tiactive")
				$(this).siblings().removeClass("tiactive");
				var value = $(this).attr("index");
				// console.log(value)
				if (value == 0) {
					type = 1;
					$(".dantwo").css("display", "none");
					$(".danone").css("display", "block");
				} else if (value == 1) {
					type = 2;
					$(".danone").css("display", "none");
					$(".dantwo").css("display", "block");
				}
			})
		})
		
			//点击我的视频 查看详情
		mui(".danone").on("tap", ".xq", function() {
			var id = $(this).attr('data-id');
			mui.openWindow({
			url:"../sub1/video.html",
			id:"video.html",
			extras: {
			videoid:id,
			}
		})
		})
			//点击我的视频 修改资料
		mui(".danone").on("tap", ".up", function() {
			var id = $(this).attr('data-id');
		  	mui.openWindow({
		  	url:"../sub3/updateshipingshangchuan.html",
		  	id:"updateshipingshangchuan.html",
			extras: {
			videoid:id,
			}
		  })
		})
		

		//点击我的商品 查看详情
		mui(".dantwo").on("tap", ".xq", function() {
			var id = $(this).attr('data-id');
			mui.openWindow({
			url:"../sub2/xqhushangpin.html",
			id:"xqhushangpin.html",
			extras: {
			shangpingid:id,
				}
			})
		})
			//点击我的商品 修改资料
		mui(".dantwo").on("tap", ".up", function() {
			var id = $(this).attr('data-id');
		  	mui.openWindow({
		  	url:"../sub3/updateshangpinshangchuan.html",
		  	id:"updateshangpinshangchuan.html",
			extras: {
			shangpingid:id,
				}
		  })
		})
		function sanangping(id){
			// mui.alert(id);
			mui.confirm("你确定要删除吗?",'提示',['取消','确定'],function(res){
				if(res.index==1){
					mui.post(url+'/juyou/shangping/deletesghangping',{id:id},function(res){
						if(res.code==200){
							mui.toast(res.msg);
							setTimeout(function(){
								window.location.reload();
							})
						}else{
							mui.toast(res.msg);
						}
					})
				}
			})
		}
		function sanshiping(id){
			mui.confirm("你确定要删除吗?",'提示',['取消','确定'],function(res){
				if(res.index==1){
					mui.post(url+'/juyou/shangping/deleteshipin',{id:id},function(res){
						if(res.code==200){
							mui.toast(res.msg);
							setTimeout(function(){
								window.location.reload();
							})
						}else{
							mui.toast(res.msg);
						}
					})
				}
			})
		}
		
		
	
	</script>


</html>
